<%-- 
    Document   : list
    Created on : 6-dec-2009, 15:24:14
    Author     : Simon
--%>

<%@include file="../../header.jsp" %>

<h1>Measurements for ${patientname}</h1>
<c:if test="${!empty flash}">
    <div class="flash notice">
        ${flash}
    </div>
</c:if>
<c:if test="${empty measurements}">
    <div>No measurements found.</div>
</c:if>
<c:if test="${!empty measurements}">

    <form id="type" action="" onsubmit="return false;" style="margin: 10px;">
        <table style="width:auto;">
            <tr>
                <td style="width: 80px; vertical-align: middle;"><b style="font-size:15px;">Select</b></td>
                <td style="width: 50px;">
                    <ul style="display:inline; list-style:none">
                        <li><a href="#" id="all" onclick="return false;" style="font-weight:bold;">All</a></li>
                        <li><a href="#"  id="none" onclick="return false;" style="font-weight:bold;">None</a></li>
                    </ul>
                </td>
                <td style=" vertical-align: middle;">
                    <c:forEach var="type" items="${types}">
                        <input type="checkbox" value="${type.name}" /><span style="padding-left:2px;margin-bottom:2px;">${type.name}</span>
                    </c:forEach>
                </td>
            </tr>
        </table>
    </form>

    <table class="data">
        <thead>
            <tr>
                <td>Measurement</td>
                <td>Value</td>
                <td>Date</td>
            </tr>
        </thead>
        <tbody>
            <c:forEach var="measurement" items="${measurements}" >
                <tr>
                    <td class="type">${measurement.type}</td>
                    <td>${measurement.measurementValue} ${measurement.unit}</td>
                    <td>${measurement.dateTaken}</td>
                </tr>
            </c:forEach>
        </tbody>
    </table>
</c:if>

<a href="${pageContext.request.contextPath}/gp/patient/measurement/new">Add new value</a>

<script type="text/javascript">
    $(document).ready(function() {

        var row = $(".type").parent().css("display");

        $("#type #all").click(function() {
            $("#type input").attr("checked","true");
            $("#type input").trigger("change");
        });
        $("#type #none").click(function() {
            $("#type input").attr("checked","");
            $("#type input").trigger("change");
        });

        $("#type input").attr("checked","true");
        $("#type input").click(function() {
            var type = $(this);
            jQuery.each($(".type"), function(i, item) {
                if ($(item).text() != type.val())
                    return;
                else if (type.attr("checked"))
                    $(this).parent().css("display",row);
                else
                    $(this).parent().css("display","none");
            });
        });
        $("#type input").change(function() {
            var type = $(this);
            jQuery.each($(".type"), function(i, item) {
                if ($(item).text() != type.val())
                    return;
                else if (type.attr("checked"))
                    $(this).parent().css("display",row);
                else
                    $(this).parent().css("display","none");
            });
        });

    });
</script>

<%@include file="../../footer.jsp" %>
